<template>
  <div class="params">
    <div class="properties">

      <SProp v-for="(item, idx) in data"
             :label="item.name"
             :key="idx">

      </SProp>
    </div>
    <div class="buttons">
      <SButton @click="onClick">完成</SButton>
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent, inject, PropType } from 'vue';
import { ProvideKey } from '@/ui-kit/window';
import SProp from '@/ui-kit/prop/prop.vue';
import SButton from '@/ui-kit/button/button.vue';

export default defineComponent({
  name: 'params',
  components: { SButton, SProp },
  emits: [],
  props: {
    data: {
      type: Array as PropType<sail.ACEParam[]>,
      default: () => {
        return [];
      },
      required: true,
    },
  },
  setup(props, { emit }) {
    const closeWindow = inject(ProvideKey.CloseWindow, () => {});
    const responseCB = inject(ProvideKey.ResponseCB, (data:any) => {});
    return {
      onClick() {
        responseCB(null);
        closeWindow();
      },
    };
  },
});
</script>
<style scoped lang="scss">
.params {
  display: flex;
  flex-direction: column;
  overflow: hidden;

  .properties {
    display: flex;
    flex-direction: column;
    flex: 1;
  }

  .buttons {
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
  }
}
</style>
